<template>
  <j-modal title="访谈信息" :width="700" :visible="visible" switchFullscreen @cancel="handleCancel" @ok="handleOk">
    <div class="box">
      <p><span>人员类型：</span>{{ 111 }}</p>
      <p><span>人员姓名：</span>{{ 111 }}</p>
      <p><span>身份证号：</span>{{ 111 }}</p>
      <p><span>性别：</span>{{ 111 }}</p>
      <p><span>家庭住址：</span>{{ 111 }}</p>
      <p><span>评估类型：</span>{{ 111 }}</p>
      <p><span>谈评估时段：</span>{{ 111 }}</p>
    </div>
    <a-tabs default-active-key="1" @change="onTabChange">
      <a-tab-pane key="1" tab="评估情况">
        <p>一 、介入目标及介入情况简述</p>
        <p>sd,fsdfjskdfkljsdf</p>
        <p>二 、目标实现程度及服务对象现状</p>
        <p>sd,fsdfjskdfkljsdf</p>
        <p>三 、需求/问题现状及目标分析</p>
        <p>sd,fsdfjskdfkljsdf</p>
        <p>四、综合评估及跟进计划</p>
        <p>sd,fsdfjskdfkljsdf</p>
      </a-tab-pane>
      <a-tab-pane key="2" tab="办公室意见">
        <p>检测时间：{{ 111 }}</p>
        <p>检测结果：{{ 111 }}</p>
        <p>检测报告：{{ 111 }}</p>
        <p>处置文档：{{ 111 }}</p>
        <p>通知单位：{{ 111 }}</p>
        <p>通知内容：{{ 111 }}</p>
      </a-tab-pane>
      <a-tab-pane key="3" tab="审批流程">
        <p>审批类型：{{ 111 }}</p>
        <p>申请时间：{{ 111 }}</p>
        <div class="stepBox">
          <a-steps progress-dot :current="current">
            <a-step v-for="item in steps" :key="item.title" :title="item.title" :description="item.description" />
          </a-steps>
        </div>
      </a-tab-pane>
    </a-tabs>
    <template slot="footer">
      <p style="text-align: left;">创建人：{{ 121212 }} <span style="margin-left:30px;">创建时间：{{ 222 }}</span> </p>
    </template>
  </j-modal>
</template>
<script>
export default {
  name: 'detailModal',
  data() {
    return {
      visible: false,
      form: {},
      current: 0,
      steps: [
        {
          title: '发起人',
          description: "112132323"
        },
        {
          title: '第1级审批',
          description: "112132323"
        },
      ],
    }
  },
  async created() {
  },
  methods: {
    show() {
      this.visible = true
    },
    handleCancel() {
      this.visible = false
    },
    onTabChange(val) {
    },
    handleOk() {
      this.visible = false
    }
  },
}
</script>
<style lang="less" scoped>
.stepBox {
  margin: 50px auto 20px auto;
  width: 60%;
}
.box {
  span {
    display: inline-block;
    width: 80px;
    text-align: left;
  }
}
</style>
